<template>
  <div class="outerTemplate" >
    <cart-header @delChose="delChose"></cart-header>

    <cart-list :allCheck="allCheck"
               :controltyp="controltyp"
               ref="cartList"
               @changeChecked="changeChecked"
               @showSelectLadder="showSelectLadder"
               @showBuyMoreLadder="showBuyMoreLadder"
               @changeControltyp="changeControltyp"
               @getDiscountCoupon="getDiscountCoupon"
               @showChoseNum="showChoseNum"
               @initAllCheck="initAllCheck"
               @showFree="showFree">

    </cart-list>

    <cart-modle ref="cartModle"
                backgroundColor="#f4f4f4">
      <cart-conpon
        :couponListCanBeUsed="couponListCanBeUsed"
        @refreshData="refreshData"
        :couponListCanBeGet="couponListCanBeGet">
      </cart-conpon>

    </cart-modle>

    <!--返利阶梯-->
    <cart-modle ref="ladderModle">
      <select-preset :ladderList="selectLadderList"
      >
      </select-preset>
    </cart-modle>

    <!--CartSelectGift 买赠阶梯-->
    <cart-modle ref="giftModle">
      <cart-select-gift
        :buyMoreLadderData="buyMoreLadderData"
      >
      </cart-select-gift>
    </cart-modle>

    <!--选择买赠-->
    <cart-modle ref="rebeatModle">
      <buy-more-list
        :buyMoreDetail="rebateEvery"
      >
      </buy-more-list>
    </cart-modle>

    <!--选择赠品-->
    <cart-modle ref="showFree">
      <buy-more-list
        :buyMoreDetail="showFreeData">
      </buy-more-list>
    </cart-modle>

    <cart-bottom :allCheck="allCheck" @changeChecked="changeChecked" @changeControltyp="changeControltyp">

    </cart-bottom>
  </div>
</template>

<script>
  import CartHeader from './CartHeader'
  import CartList from './CartList'
  import CartBottom from './CartBottom'
  import CartConpon from '@/real-components/CartConpon'
  import CartModle from '@/real-components/CartMode'
  import CartSelectGift from '../../real-components/CartRegular/CartSelectGift'
  import {getPageTree, initDomTree} from "../../utils/getPageTree";
  import SelectPreset from '../../real-components/CartRegular/CartSelectPreset'
  import BuyMoreList from '../../real-components/CartRegular/BuyMoreList'
  import {mapGetters,mapMutations} from "vuex";
  import {translateDetailData} from '@/utils/TranslateDetailDate'

  export default {
    data() {
      return {
        msg: '这是测试首页',
        page: "cart",
        type: {
          list: "list",
          header: "header"
        },
        allCheck: false,
        controltyp: 0, // 1全选 2全取消  0 自由状态
        couponListCanBeUsed: null,
        couponListCanBeGet: null,
        selectLadderList: [],
        buyMoreLadderData: null,
        rebateEvery: null,
        showFreeData: null,
      }
    },
    components: {
      CartHeader,
      CartList,
      CartBottom,
      CartModle,
      SelectPreset,
      CartConpon,
      CartSelectGift,
      BuyMoreList

    },
    computed: {
      activeCartList() {
        return this.$store.state.lyj.activeCartList
      },
    },
    watch: {},
    methods: {
      //更改全选控制状态
      changeControltyp(data) {
        this.controltyp = data
      },

      refreshData() {
        this.$refs.cartList && this.$refs.cartList.queryRegularDetail()
      },
      // 点击删除按键
      delChose() {
      },
      delfromServe() {
        var confirm = {}
      },
      //更改选中状态
      changeChecked(data) {
        this.allCheck = data
      },
      showModle(eleName) {
        this.$refs[eleName] && this.$refs[eleName].showModle()
      },
      //优惠券获取列表
      getDiscountCoupon(data) {
        this.showModle('cartModle')
        this.couponListCanBeUsed = data.couponListCanBeUsed
        this.couponListCanBeGet = data.couponListCanBeGet
      },
      // 展示优加赠列表
      showSelectLadder(data) {
        this.selectLadderList = data
        console.log('//////', data)
        this.showModle('ladderModle')
      },
      //展示可选礼品列表
      showBuyMoreLadder(data) {
        this.showModle('giftModle')
        this.buyMoreLadderData = data
      },

      showChoseNum(data) {
        this.showModle('rebeatModle')
        this.rebateEvery = data
      },

      showFree(data) {
        this.showModle('showFree')
        this.showFreeData = data
      },

      initAllCheck() {
        var data = this.activeCartList
        this.allCheck = data.every((item) => {
          var item = translateDetailData(item)
          return item.preorder || item.lastStockCountNum <= 0
        })
      },
    },
    async created() {
      this.$store.dispatch('lyj/clearFoodDetail')
    },
    mounted() {
    },
    updated() {
    },
    beforeDestroy() {
      this.$store.dispatch('lyj/clearFoodDetail')
    }
  }
</script>

<style scoped>
  .outerTemplate {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
  }
</style>
